<template>
  <div>
       <mt-header fixed  :class="bgcolor" v-if="left.status">
            <div slot="left" v-show="left.status">
                <mt-button @click="back"  :icon="left.icon || 'back'" >{{text}}</mt-button>
            </div>
            <div slot="right" v-show="right.status"  @click="rightClick">
               {{right.text}} <span :class="right.icon"></span>
            </div>
            <!-- <mt-button v-if="right" icon="more"   ></mt-button> -->
        </mt-header>
        <mt-header fixed :title="text"  :class="bgcolor" v-else>
            <div slot="left" v-show="left.status">
                <mt-button @click="back"  :icon="left.icon || 'back'" >{{text}}</mt-button>
            </div>
            <mt-button v-if="right" slot="right" v-show="right.status"  @click="rightClick"><span :class="right.icon"></span>{{right.text}}</mt-button>
        </mt-header>
  </div>
</template>
<script>
export default {
    props:{
        text: {
            type: String,
            default: ''
        },
        left:{
            type:Object,
            default:function() {
               return  {
                    status:false,
                    text:"返回",
                    icon:"back"
                }
            }
        },
        right:{
            type:Object,
            default: function() {
                return {
                    status:false,
                    text:"更多"
                }
            }
        },
        icon:""
    },
    data() {
        return {
            bgcolor:'red'
        }
    },
    methods: {
        back () {
            this.$router.back();
            this.$emit('back');
        },
        rightClick() {
            this.$emit('rightClick');
        }
    },
}
</script>
<style lang="less" scoped>
@import url('../../../static/css/theme.less');
.themea {
  .theme(); //默认的样式
}
.themeb {

  .theme(blue);
}
.themec {
  .theme(#111);
}
</style>

<style scoped>
.red {
    /* background:red; */
}
.mint-header {
  background-color: #f7a95c !important;
  /* border-bottom: 1px solid #1f57a4; */
  height: 50px !important;
  /* padding-top: 20px !important; */
}
</style>